import React from 'react';
import { Button } from 'antd';
import { history } from 'umi'
import moment from 'moment';
import { PageContainer } from '@/molecules';
import { FormHeader } from '../components';
import { Declare } from '../containers';

const getLocalItem = id => {
    if (id) {
        const nowItem = localStorage.getItem('localDeclare');
        let obj = null;
        if (nowItem) {
            try {
                obj = JSON.parse(nowItem);
            } catch (error) {
                console.log(error);
            }
        }
        return obj?.[id] || null;
    }
    return null;
};

const DeclarePreview = ({ location }) => {
    const { query } = location;
    const { id } = query;
    const [flag, setFlag] = React.useState(false);
    const declareObj = React.useMemo(() => getLocalItem(id), [id]);

    const handlePreview = () => {
        history.push({
            pathname: '/office/personnelManagement/recruitment/setting/law',
            state: { tabRoute: true },
            query: {
                id
            }
        });
    };

    return (
        <PageContainer title="声明预览">
            <div style={{ maxWidth: 1000, paddingBottom: 24 }}>
                <div
                    style={{
                        margin: '10px 0 24px',
                        padding: '80px 20px',
                        textAlign: 'center',
                        fontSize: 56,
                        color: 'rgba(0,0,0,0.2)',
                        background: '#FAFAFA'
                    }}
                >
                    信息填写区域
                </div>
                <FormHeader title="声明" />
                <Declare
                    value={flag}
                    title={declareObj?.title}
                    file={declareObj?.file}
                    onChange={setFlag}
                    onPreview={handlePreview}
                />
                <div>应聘日期：{moment().format('YYYY年MM月DD日')}</div>
                <div style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', padding: '50px 0' }}>
                    <Button type="primary" style={{ padding: '0 50px' }} disabled>
                        提交
                    </Button>
                </div>
            </div>
        </PageContainer>
    );
};

export default DeclarePreview;
